<template>
	<div class="box">
		<ul>
			<li>
				<img src="https://img.alicdn.com/imgextra/i1/3390270589/O1CN01ya4Caw1GDnzszmvtZ_!!3390270589.jpg" >
				<div class="center">
					<p>系统消息</p>
					<h2>线下公告</h2>
				</div>
				<div class="right">
					<span>昨天</span>
				</div>
			</li>
			<li>
				<img src="https://img.alicdn.com/imgextra/i3/3390270589/O1CN01TeW6ia1GDo01YobwX_!!3390270589.jpg" >
				<div class="center">
					<p>智能小助理</p>
					<h2>主人，您好</h2>
				</div>
				<div class="right">
					<span>2021/10/25</span>
				</div>
			</li> 
			<li>
				<img src="https://img.alicdn.com/imgextra/i2/3390270589/O1CN01pX6y601GDo02ZfMSc_!!3390270589.jpg" >
				<div class="center">
					<p>热门活动</p>
					<h2>古风福袋优惠购</h2>
				</div>
				<div class="right">
					<span>2021/09/25</span>
				</div>
			</li> 
			<li>
				<img src="https://img.alicdn.com/imgextra/i3/3390270589/O1CN016TWlzz1GDnzm89L43_!!3390270589.jpg" >
				<div class="center">
					<p>问卷调研</p>
					<h2>有奖问卷调研</h2>
				</div>
				<div class="right">
					<span>2021/08/22</span>
				</div>
			</li> 
			<li>
				<img src="https://img.alicdn.com/imgextra/i3/3390270589/O1CN01qtPm8O1GDnzwiGhjZ_!!3390270589.jpg" >
				<div class="center">
					<p>热门活动</p>
					<h2>最新电影抢先看</h2>
				</div>
				<div class="right">
					<span>2021/07/01</span>
				</div>
			</li> 
			<li>
				<img src="https://img.alicdn.com/imgextra/i1/3390270589/O1CN017e3Dx71GDo00ocmpW_!!3390270589.jpg" >
				<div class="center">
					<p>U豆福利</p>
					<h2>你的宠爱福利已送达</h2>
				</div>
				<div class="right">
					<span>2021/06/08</span>
				</div>
			</li>  
		</ul>
	</div>
	
</template>

<script>
	export default {
	name:"NewsList"
	}
</script>



<style scoped>
.box{
	width: 100%;
	height: 0.5rem;
	padding: 0 .18rem;
	box-sizing: border-box;
}
.box ul{
	width: 100%;
	height: 4.4rem;
	/* display: flex;
	justify-content: space-between; */
	margin-top: 2rem;
}
.box ul li{
	width: 100%;
	height: .7rem;
	padding-top: .1rem;
}
.box ul li img{
	float: left;
}
.box ul li .center{
	width: 1.5rem;
	height: .7rem;
	float: left;
	margin-left: .12rem;
}
.box ul li p{
	font-size: .15rem;
	margin-top: .1rem;
}
.box ul li h2{
	font-size: .12rem;
	color: #b6b6b6;
	margin-top: .08rem;
}
.box ul li .right{
	height: .7rem;
	float: right;
	line-height: .7rem;
}


</style>
